import { createUseStyles } from "react-jss";

interface Props {
  fontSize: number;
}

export const useStyles = createUseStyles({
  wrap: {
    fontSize: (props: Props) => props.fontSize,
    color: "#666",
  },
  flexWrap: {
    display: "flex",
    flexWrap: "nowrap",
    position: "relative",
    boxSizing: "border-box",
  },
  item: {
    boxSizing: "border-box",
    display: "flex",
    height: "40px",
    MozBoxSizing: "border-box",
    WebkitBoxSizing: "border-box",
    alignItems: "center",
  },
  title: {
    background: "#EFEFEF",
    fontWeight: "bold",
    color: "#333",
    paddingLeft: "16px",
  },
  placeholder: {
    display: "inline-block",
    width: "30px",
  },
  line: {
    width: "100%",
    height: "1px",
    backgroundColor: "#E9E9E9",
    position: "absolute",
    bottom: "0",
  },
});
